<template>
  <UserCardList :user-list="userList"/>
  <van-empty
      v-if="userList.length < 1 || userList === []"
      description="未匹配到用户"/>
</template>

<script setup lang="ts">
import {useRoute} from "vue-router";
import {onMounted} from "vue";
import qs from 'qs'
import {ref} from 'vue'
import {UserSearchByTags} from "../../services/api.ts";
import UserCardList from '../../components/UserCardList/index.vue'

const route = useRoute();
const {tags} = route.query;
const userList: API.User[] = ref([])

onMounted(async () => {
  const res = await UserSearchByTags({
    params: {
      tagIdList: tags,
      current: 0,
      pageSize: 10,
    },
    paramsSerializer: params => {
      return qs.stringify(params, {indices: false})
    }
  })
  // console.log(res)
  if (res.code === 0) {
    userList.value = res.data
  }
})




// const mockUser: API.User = [{
//   id: 12345,
//   username: '鱼皮',
//   profile: '一名精神小伙，目前还有头发，谢谢大家，阿爸爸阿爸爸阿巴阿巴阿巴',
//   avatarUrl: 'https://i2.hdslb.com/bfs/face/4633107def1b4cb3bef2c2806d619a0f10b89f35.jpg@96w_96h_1c_1s_!web-avatar.avif',
//   gender: 0,
//   phone: '13113113111',
//   email: '592342843721987@xzcxzczxcz.com',
//   tags: ['java', 'emo', '打工中', 'emo', '打工中'],
//   createTime: new Date(),
// }, {
//   id: 12345,
//   username: '鱼皮',
//   profile: '一名精神小伙，目前还有头发，谢谢大家，阿爸爸阿爸爸阿巴阿巴阿巴',
//   avatarUrl: 'https://i2.hdslb.com/bfs/face/4633107def1b4cb3bef2c2806d619a0f10b89f35.jpg@96w_96h_1c_1s_!web-avatar.avif',
//   gender: 0,
//   phone: '13113113111',
//   email: '592342843721987@xzcxzczxcz.com',
//   tags: ['java', 'emo', '打工中', 'emo', '打工中'],
//   createTime: new Date(),
// }]


</script>

<style scoped>

</style>